<template>
  <div>
    <h3>作用域插槽</h3>
    <!-- 直接在组件标签上使用v-slot="{对应的属性名}"  只能在该组件有且公有一个作用域下的默认插槽时使用(了解) -->
    <!-- <SlotSon v-slot="{ num }"> -->
    <SlotSon>
      <!-- <template v-slot="scope">
          scope={num:相应的值}
        <div>我接收到作用域插槽传过来的值:{{ scope.num }}</div>
      </template> -->
      <template v-slot="{ num }">
        <div>我接收到作用域插槽传过来的值:{{ num }}</div>
      </template>
      <template #xxx="{abc,num2}">
        <h4>我是作用域插槽下的具名插槽</h4>
        <div>{{ abc }}</div>
        <div>{{ num2 }}</div>
      </template>
    </SlotSon>
  </div>
</template>
<script>
import SlotSon from './compoents/SlotSon.vue'
export default {
  components: {
    SlotSon
  }
}
</script>
<style></style>
